<template>
  <div>
    <a-card class="tree-container" :loading="tableLoading">
      <a-form ref="formRef" :model="formState" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
        <a-row>
          <a-col :span="12">
            <a-form-item label="名称" name="instName">
              <a-input v-model:value="formState.instName" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="全称" name="fullName">
              <a-input v-model:value="formState.fullName" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="LOGO" name="region">
              <a-input v-model:value="formState.logo" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="背景图片" name="backgroundImage">
              <a-input v-model:value="formState.backgroundImage" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="认证域名" name="domain">
              <a-input v-model:value="formState.domain" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="系统名称" name="frontTitle">
              <a-input v-model:value="formState.frontTitle" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="控制台域名" name="consoleDomain">
              <a-input v-model:value="formState.consoleDomain" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="控制台名称" name="consoleTitle"> <a-input v-model:value="formState.consoleTitle" /> </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="验证码" name="captcha">
              <a-select v-model:value="formState.captcha" placeholder="请选择验证码">
                <a-select-option value="NONE">无</a-select-option>
                <a-select-option value="TEXT">字符</a-select-option>
                <a-select-option value="ARITHMETIC">算术</a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="认证跳转" name="defaultUri">
              <a-input v-model:value="formState.defaultUri" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="联系人" name="contact">
              <a-input v-model:value="formState.contact" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="电话" name="phone">
              <a-input v-model:value="formState.phone" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="邮箱" name="email">
              <a-input v-model:value="formState.email" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="地址" name="address">
              <a-input v-model:value="formState.address" />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item :wrapper-col="{ span: 14, offset: 4 }">
              <a-button type="primary" @click="onSubmit">提交</a-button>
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
    </a-card>
  </div>
</template>

<script setup>
import { reactive, ref, toRaw, onMounted } from 'vue';
import { configureApi } from '../../../api/system/configure-api.js';
import { message } from 'ant-design-vue';
const formRef = ref();
const labelCol = {
  span: 5,
};
const wrapperCol = {
  span: 13,
};
const formState = ref({
  instName: '',
  fullName: '',
  division: '',
  country: '',
  region: '',
  locality: '',
  street: '',
  address: '',
  postalCode: '',
  phone: '',
  fax: '',
  email: '',
  description: '',
  logo: '',
  backgroundImage: '',
  domain: '',
  frontTitle: '',
  consoleDomain: '',
  consoleTitle: '',
  captcha: '',
  defaultUri: '',
});
const rules = {};
const onSubmit = () => {
  formRef.value
    .validate()
    .then(async () => {
      let res = await configureApi.updateCurrent(formState.value);
      if (res.code == 0) {
        message.success('配置成功');
      } else {
        message.error('配置失败');
      }
    })
    .catch((error) => {
      console.log('error', error);
    });
};
const resetForm = () => {
  formRef.value.resetFields();
};

onMounted(() => {
  init();
});

const tableLoading = ref(false);
// 查询
async function init() {
  try {
    tableLoading.value = true;
    let res = await configureApi.getCurrent();
    if (res.code == 0) {
      formState.value = res.data;
    }
  } catch (e) {
    console.error(e);
  } finally {
    tableLoading.value = false;
  }
}
</script>

<style lang="scss" scoped></style>